<template>
	<ul class="List">
		<li v-for="item in iconsList" :key="item.id">
			<router-link to="/">
				<img :src="item.imgURL" />
				<p>{{item.title}}</p>
			</router-link>
		</li>
	</ul>
</template>

<script>
	export default{
		name:'List',
		data(){
			return{
				iconsList :[
					{id :1,imgURL:'@/assets/img/0001.png',title:'周边游'},
					{id :2,imgURL:'@/assets/img/0002.png',title:'国内游'},
					{id :3,imgURL:'@/assets/img/0003.png',title:'出境游'},
					{id :4,imgURL:'@/assets/img/0004.png',title:'自由行'},
					{id :5,imgURL:'@/assets/img/0005.png',title:'酒店名宿'},
				]
			}
		}
	}
</script>

<style scoped>
	a{
		text-decoration: none;
	}
	.List{
		border-bottom: 0.03rem solid #d3d3d3;
		overflow: hidden;
		padding: 0.6rem 0 0;
	}
	.List li{
		float: left;
		width: 25%;
		text-align: center;
	}
	.List li img{
		width: 2rem;
		height: 2rem;
	}
	.List li p{
		color: red;
		padding-top: 0.15rem;
		padding-bottom: 0.5rem;
	}
</style>
